// slide({imgs: [1, 2, 3], bg: 0})
// slide([1, 2, 3])
mixin slide(params)
  -var imgs = []
  if Array.isArray(params)
    -var imgs = params
  else if typeof params === 'object'
    -var bg = params.bg
    -imgs = params.imgs
  -var {url: bgUrl, width: w, height: h} = (bg || bg == 0) ? images[bg] : images[imgs[0]]

  section(style='height: 0;')
    svg.slide-bg(data-fill='#494600', 
      style=`display: inline-block; width: 100%; vertical-align: top; background-position: 0% 0%; 
      background-repeat: no-repeat; background-size:100% 100%; background-attachment: scroll; 
      background-image: url("${bgUrl}");
      -webkit-tap-highlight-color:transparent;-webkit-user-select:none;line-height:0;
      font-size:0px;pointer-events:none;margin-top:-1px`, 
      viewBox=`0 0 ${w} ${h}`)
  section#Slide(style='vertical-align:top;margin-top:-1px;')
    section(style='width: 100%;display: flex;overflow-x: auto;overflow-y:hidden;overscroll-behavior: auto;-webkit-overflow-scrolling:touch;box-sizing:border-box;max-width:100% !important;')
      for idx in imgs
        section.part-block(style='width: 100%;margin: 0px;flex: 0 0 auto;text-align: center;box-sizing:border-box;max-width:100% !important;')
          section(style='pointer-events:none;transform: scale(1);-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);')
            svg(
              viewBox=`0 0 ${w} ${h}`, space='default',
              style=`pointer-events:none;display: inline-block; width: 100%; vertical-align: top; background-position: 0% 0%; 
              background-repeat: no-repeat; background-size:100% 100%; background-attachment: scroll; 
              -webkit-tap-highlight-color:transparent;-webkit-user-select:none;
              background-image: url("${images[idx].url}");box-sizing:border-box;max-width:100% !important;`
            )
